NativeBase

오랜만에 상관없는 이미지

React Native 다들 개발은 하고 계시죠? 개발자라면 한 번 도전은 해 봤을 텐데요.(응?) 죄송합니다. Native 컴포넌트를 Javascript로 그리고, Style을 직접 주다 보니 본의아니게 개자이너 혹은 디발자의 영역을 넘나드셨을 거라고 봅니다.

그러다 보면 당연하게 생기는 생각이 “아 부트스트랩 같은 녀석 없을까” 인데 여기 그런 프로젝트가 있습니다.

2016/05/03 Editor’s choice

GeekyAnts/NativeBase
_NativeBase - The missing piece of React Native_github.com


설치를 합시다.

설치는 간단합니다. (물론 react-native를 해 보셨다면 말이죠.)

프로젝트에서는 일단 react-native init 부터 시작하던데 다음의 명령어면 기존 프로젝트도 충분합니다.

npm install native-base --save

만약에 처음부터 만들 요랑이시라면

react-native init AwesomeNativeBase  
cd AwesomeNativeBase  
npm install

명령어가 먼저 필요합니다.

rnpm

rnpm이라는 명령어는 react-native 를 사용하는데 요즘은 필수가 되었습니다. native 컴포넌트를 가진 프로젝트를 추가하면 (npm install) 이후 관례적으로 해 주게 되는데요

  • $rnpm link

명령어로 가능합니다. 기본적으로 설치되어 있는 모듈 전부에 대한 링크를 점검해 줍니다.


실행

이런 일들이 갖추어 지고 나면 xcode를 켜서 run 을 통해 실행을 해 봅니다.

엇 달라진게 없습니다.

index.ios.js 소스를 고쳐보겠습니다.

그리고 다시 실행을 하면

어익후 깜짝이야

이런 그림이 나타납니다.

분명히 개자이너, 디발자 어쩌구 저쩌구 했는데, 아무리 좋은 툴을 가져다 줘도 저같은 디알못은 소용없나 봅니다.


아 글쎄 이쁘다니깐요

http://nativebase.io/docs/v0.2.1/assets/img/magic-with-nativebase-020.mp4

클릭은 위의 링크. 미디엄은 이미지 링크를 지원하라!

동영상을 감상해 보시면 글쎄 이쁜… 프로젝트가 나옵니다.

By Keen Dev on May 2, 2016.

Exported from Medium on May 31, 2017.